/*
 * @Author: silas 
 * @Date: 2021-04-02 10:10:15 
 * @Last Modified by: silas
 * @Last Modified time: 2021-04-02 17:03:29
 */
<template>
    <div class="tobBtoC">
        <div class="contentTopTitle">
            <div class="fl">
                <div class="title">资源数据导入详情</div>
            </div>
            <div class="fr">
                <el-button
                    @click="$router.push({ path: '/budget/lightEva', query: { type: 'second' } })"
                    size="mini"
                    >返回</el-button
                >
            </div>
        </div>
        <div class="table-content clearfix">
            <div class="content">
                <div class="tableBox">
                    <el-table
                        id="table1"
                        ref="table"
                        size="mini"
                        :header-cell-style="{ background: '#eef1f6' }"
                        :data="tableData"
                        v-loading="tableLoading"
                        style="width: 100%"
                        border
                    >
                        <el-table-column
                            prop="areaName"
                            label="区域"
                            width="140"
                        />
                        <el-table-column v-for="(it, i) in titles" :key="i" :prop="it.typeCode" :label="it.typeName"></el-table-column>
                    </el-table>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import prefixAPI from "@/api/prefixAPI";
import { getCookie } from "@/common/js/cookie";
import { getSessionStorage } from "@/common/js/storage";
import { $budgetAPI } from "@/api";
export default {
    name: "sacleDetail",
    data() {
        return {
            form: {
                time: this.moment().format("yyyy"),
            },
            tableData: [],
            tableLoading: false,
            titles: [],
        };
    },
    mounted() {
        let that = this;

        that.accountInfo = JSON.parse(getSessionStorage("accountInfo"));
        that.form.areaId = that.accountInfo.areaId;
        // that.form.time = that.moment().format("YYYYMM");
        that.getData();
    },
    methods: {
        init() {},
        getData() {
            var that = this;

            that.tableLoading = true;
            $budgetAPI.InterfaceADetailList(
                {
                    recordId: that.$route.query.id,
                },
                (res) => {
                    if (res && res.code == 0) {
                        res.content.datalist.map((it) => {
                            it.detailList.map((item, i) => {
                                it[item.type] = item.number;
                            });
                        });
                        that.tableData = res.content.datalist;
                        that.titles = res.content.typelist;
                    }
                    that.tableLoading = false;
                }
            );
        },
    },
};
</script>

<style lang="scss" scoped>
.remark {
    padding-top: 5px;
    text-align: left;
    .attention {
        font-weight: bold;
    }
}
.table-content {
    .table-header {
        display: flex;
        justify-content: space-between;
        .table-title {
            font-size: 14px;
            font-weight: bold;
            height: 30px;
            line-height: 30px;
            span {
                display: inline-block;
                width: 5px;
                height: 5px;
                background-color: #418ee9;
                border-radius: 1000%;
                overflow: hidden;
                margin-right: 10px;
                margin-bottom: 3px;
            }
        }
    }
    .content {
        margin-top: 15px;
    }
}
</style>
